<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="author" content="Parallelus" />
	<meta name="description" content="A brief description of this website or your business." />
	<meta name="keywords" content="keywords, or phrases, associated, with each page, are best" />
	<title>Unite - Together is Better (created by Parallelus)</title>
	
	<!-- Favorites icon -->
	<link rel="shortcut icon" href="http://para.llel.us/favicon.ico" />
	
	<!-- Style sheets -->
	<link rel="stylesheet" type="text/css" href="css/reset.min.css" />
	<link rel="stylesheet" type="text/css" href="css/menu.min.css" />
	<link rel="stylesheet" type="text/css" href="css/fancybox.css" />
	<link rel="stylesheet" type="text/css" href="css/tooltip.min.css" />
	<link rel="stylesheet" type="text/css" href="css/default.css" />
	
	<!-- jQuery framework and utilities -->
	<script type="text/javascript" src="js/jquery-1.4.min.js"></script>
	<script type="text/javascript" src="js/jquery-ui-1.7.2.min.js"></script>
	<script type="text/javascript" src="js/jquery.easing.1.3.min.js"></script>
	<script type="text/javascript" src="js/hoverIntent.min.js"></script>
	<script type="text/javascript" src="js/jquery.bgiframe.min.js"></script>
	<!-- Drop down menus -->
	<script type="text/javascript" src="js/superfish.min.js"></script>
	<script type="text/javascript" src="js/supersubs.min.js"></script>
	<!-- Tooltips -->
	<script type="text/javascript" src="js/jquery.cluetip.min.js"></script>
	<!-- Input labels -->
	<script type="text/javascript" src="js/jquery.overlabel.min.js"></script>
	<!-- Anchor tag scrolling effects -->
	<script type="text/javascript" src="js/jquery.scrollTo-min.js"></script>
	<script type="text/javascript" src="js/jquery.localscroll-min.js"></script>
	<!-- Inline popups/modal windows -->
	<script type="text/javascript" src="js/jquery.fancybox-1.2.6.pack.js"></script>		
	<!-- Font replacement (cufón) -->
	<script src="js/cufon-yui.js" type="text/javascript"></script>
	<script src="js/LiberationSans.font.js" type="text/javascript"></script>

	<!-- IE only includes (PNG Fix and other things for sucky browsers -->
	
	<!--[if lt IE 7]>
		<link rel="stylesheet" type="text/css" href="css/ie-only.css">
		<script type="text/javascript" src="js/pngFix.min.js"></script>
		<script type="text/javascript"> 
			$(document).ready(function(){ 
				$(document.body).supersleight();
			}); 
		</script> 
	<![endif]-->
	<!--[if IE]><link rel="stylesheet" type="text/css" href="css/ie-only-all-versions.css"><![endif]-->
	
	
	<!-- BEGIN: For Demo Only -->
		<!--			
		These entries are only needed for demo features, such as the real-time skin changer.
		They can be deleted for production installs without effecting the theme's design or 
		any of the funcionality.
		-->
		<script type="text/javascript" src="js/demo.js"></script>	
		<link rel="stylesheet" type="text/css" href="css/demo.css" />
	<!-- END: For Demo Only -->
	

	<!-- Functions to initialize after page load -->
	<script type="text/javascript" src="js/source/onLoad.js"></script>
	
	
</head>
<body>

<!-- Top reveal (slides open, add class "topReveal" to links for open/close toggle ) -->
<div id="ContentPanel">

	<!-- close button -->
	<a href="#" class="topReveal closeBtn">Close</a>
	
	<div class="contentArea">

		<!-- New member registration -->
		<div class="right" style="margin:10px 0 0;">
			<h1>
				Not a member yet?
				<span>Register now and get started.</span>
			</h1>
			<button type="button">Register for an account</button>
		</div>
		
		<!-- Alternate Login -->				
		<div>
			<form class="loginForm" method="post" action="" style="height:auto;">
				<div id="loginBg"><img src="../../images/icons/lock-and-key-110.png" width="110" height="110" alt="lock and key" /></div>
				<h2 style="margin-top: 20px;">Sign in to your account.</h2>
				<fieldset>
					<legend>Account Login</legend>
					<p class="left" style="margin: 0 8px 0 0;">
						<label for="RevealUsername" class="overlabel">Username</label>
						<input id="RevealUsername" name="RevealUsername" type="text" class="loginInput textInput rounded" />
					</p>
					<p class="left" style="margin: 0 5px 0 0;">
						<label for="RevealPassword" class="overlabel">Password</label>
						<input id="RevealPassword" name="RevealPassword" type="password" class="loginInput textInput rounded" />
					</p>
					<p class="left" style="margin: -7px 0 0;">
						<button type="submit" class="btn" style="margin:0;"><span>Sign in</span></button>
					</p>
				</fieldset>
				<p class="left noMargin">
					<a href="#">Forgot your password?</a>
				</p>
			</form>		
		</div>
		
		<!-- End of Content -->
		<div class="clear"></div>
	
	</div>
</div>

<!-- Site Container -->
<div id="Wrapper">
	<div id="PageWrapper">
		<div class="pageTop"></div>
		<div id="Header">
		
			<!-- Main Menu -->
			<div id="MenuWrapper">
				<div id="MainMenu">
					<div id="MmLeft"></div>
					<div id="MmBody">
						
						<!-- Main Menu Links -->
						<ul class="sf-menu">
							<li class="current"><a href="index.html">Home</a></li>
							<li>
								<a href="#">Features</a>
								<ul>
									<li><a href="#">Home page</a>
										<ul>
											<li><a href="index.html">Home 1 (default)</a></li>
											<li><a href="index-2.html">Home 2 (CU3ER)</a></li>
											<li><a href="index-3.html">Home 3 (GalleryView)</a></li>
										</ul>
									</li>
									<li><a href="sample-portfolio.html">Portfolio</a></li>
									<li><a href="sample-blog.html">Blog</a></li>
									<li>
										<a href="sample-login.html" class="login">Login</a>
										<ul>
											<li><a href="sample-login.html" class="login">Style 1 (popup)</a></li>
											<li><a href="#ContentPanel" class="topReveal">Style 2 (slide)</a></li>
										</ul>
									</li>
									<li><a href="sample-text.html">Text Styles</a></li>
									<li><a href="theme-information.html">About the Theme</a></li>
								</ul>
							</li>
							<li>
								<a href="#">Skins</a>
								<ul>

									<li>
										<a href="#" onclick="switchSkin('1');">Skin 1</a>
										<ul>
											<li style="text-align:center;"><a href="#" onclick="switchSkin('1');"><img class="skin" src="../../images/content/skin-changer/skin-1.jpg" height="250" alt="Skin 1" /></a></li>
										</ul>
									</li>
									<li>
										<a href="#" onclick="switchSkin('2');">Skin 2</a>
										<ul>
											<li style="text-align:center;"><a href="#" onclick="switchSkin('2');"><img class="skin" src="../../images/content/skin-changer/skin-2.jpg" height="250" alt="Skin 2" /></a></li>
										</ul>
									</li>
									<li>
										<a href="#" onclick="switchSkin('3');">Skin 3</a>
										<ul>
											<li style="text-align:center;"><a href="#" onclick="switchSkin('3');"><img class="skin" src="../../images/content/skin-changer/skin-3.jpg" height="250" alt="Skin 3" /></a></li>
										</ul>
									</li>
									<li>
										<a href="#" onclick="switchSkin('4');">Skin 4</a>
										<ul>
											<li style="text-align:center;"><a href="#" onclick="switchSkin('4');"><img class="skin" src="../../images/content/skin-changer/skin-4.jpg" height="250" alt="Skin 4" /></a></li>
										</ul>
									</li>
									<li>
										<a href="#" onclick="switchSkin('5');">Skin 5</a>
										<ul>
											<li style="text-align:center;"><a href="#" onclick="switchSkin('5');"><img class="skin" src="../../images/content/skin-changer/skin-5.jpg" height="250" alt="Skin 5" /></a></li>
										</ul>
									</li>
								</ul>
							</li>
							<li>
								<a href="sample-layout.html">Layout</a>
								<ul>
									<li><a href="sample-layout.html">Default Page</a></li>
									<li><a href="sample-layout.html#full_page">Full Page</a></li>
									<li><a href="sample-layout.html#blog_page">Blog</a></li>
									<li><a href="sample-layout.html#multi_column_page">2 &amp; 3 Column</a></li>
								</ul>
							</li>	
							<li><a href="sample-contact.html">Contact</a></li>	
						</ul>
						
						<div class="mmDivider"></div>				
						
						<!-- Extra Menu Links -->
						<ul id="MmOtherLinks" class="sf-menu">
							<li>
								<a href="#"><span class="mmFeeds">Feeds</span></a>
								<ul>
									<li><a href="#"><span class="mmRSS">RSS</span></a></li>
									<li><a href="#"><span class="mmFacebook">Facebook</span></a></li>
									<li><a href="#"><span class="mmTwitter">Twitter</span></a></li>
								</ul>
							</li>
							<li><a href="sample-login.html" class="login"><span class="mmLogin">Login</span></a></li>
						</ul>
						
					</div>
					<div id="MmRight"></div>
				</div>
			</div>
			
			<!-- Search -->
			<div id="Search">
				<form action="#" id="SearchForm" method="post">
					<p style="margin:0;"><input type="text" name="SearchInput" id="SearchInput" value="" /></p>
					<p style="margin:0;"><input type="submit" name="SearchSubmit" id="SearchSubmit" class="noStyle" value="" /></p>
				</form>
			</div>
			
			<!-- Logo -->
			<div id="Logo">
				<a href="index.html"></a>
			</div>
			
			<!-- End of Content -->
			<div class="clear"></div>
		
		</div>
		
		<div class="pageMain">

			<!-- Page Content -->
			<div class="contentArea">
			
				<!-- Title / Page Headline -->
				<div class="full-page">
					<h1 class="headline"><strong>Portfolio</strong> &nbsp;//&nbsp; A collection of featured work samples.</h1>
				</div>
				
				<div class="hr"></div>

				<!-- Breadcrumbs -->
				<div class="full-page">
					<p class="breadcrumbs">
						<a href="index.html">Home</a> <span>&raquo;</span> <a href="#">Some Page</a> <span>&raquo;</span> <a href="#">Some Page</a> <span>&raquo;</span> This Page
					</p>
				</div>
				
				<!-- End of Content -->
				<div class="clear"></div>
			</div>
			
			<!-- Highlight graphics -->
			<div class="contentArea">
				<div class="full-page">
					<a href="images/content/demo-only/portfolio/sample8.jpg" class="zoom img" title="This is the image description" rel="portfolio" style="margin-right: 17px;">
						<img src="../../images/content/demo-only/portfolio/sample8-thumb.jpg" width="150" height="100" alt="sample image" />
					</a>
					<a href="images/content/demo-only/portfolio/sample6.jpg" class="zoom img" title="This is the image description" rel="portfolio" style="margin-right: 17px;">
						<img src="../../images/content/demo-only/portfolio/sample6-thumb.jpg" width="150" height="100" alt="sample image" />
					</a>
					<a href="images/content/demo-only/portfolio/sample4.jpg" class="zoom img" title="This is the image description" rel="portfolio" style="margin-right: 17px;">
						<img src="../../images/content/demo-only/portfolio/sample4-thumb.jpg" width="150" height="100" alt="sample image" />
					</a>
					<a href="images/content/demo-only/portfolio/sample2.jpg" class="zoom img" title="This is the image description" rel="portfolio" style="margin-right: 17px;">
						<img src="../../images/content/demo-only/portfolio/sample2-thumb.jpg" width="150" height="100" alt="sample image" />
					</a>
					<a href="images/content/demo-only/portfolio/sample10.jpg" class="zoom img" title="This is the image description" rel="portfolio">
						<img src="../../images/content/demo-only/portfolio/sample10-thumb.jpg" width="150" height="100" alt="sample image" />
					</a>
				</div>
				
				<!-- End of Content -->
				<div class="clear"></div>

			</div>

			
		<!-- BEGIN: Floating content area -->	
		</div>
		<div class="pageBottom"></div>
		<div class="pageTop"></div>
		<div class="pageMain">
		
			<div class="contentArea">
				<div class="full-page">
					<h1 class="headline center" style="margin-bottom:0;">Providing client services in <strong>web</strong>, <strong>print</strong> and <strong>multimedia</strong> design.</h1>
				</div>
				
				<!-- End of Content -->
				<div class="clear"></div>

			</div>
		
		</div>
		<div class="pageBottom"></div>
		<div class="pageTop"></div>
		<div class="pageMain">
		<!-- END: Floating content area -->

			<div class="contentArea">
				<div class="full-page">
				
					<!-- Gallery/Portfolio -->
					<div class="portfolio">
					
						<div class="portfolio-item">
							<a href="images/content/demo-only/portfolio/sample3.jpg" class="zoom img" title="This is the image description" rel="portfolio">
								<img src="../../images/content/demo-only/portfolio/sample3-thumb.jpg" class="portfolio-image" alt="sample image" />
							</a>
							<div class="portfolio-description">
								<h4>Lorem Ipsum Dolor</h4>
								<p>Sed molestie, neque sed felis nisl mi sed odio. Aliquam mollis metus vel dolor amet nisi vehicula accumsan luctus a pretium.</p>
								<a href="#">More Information...</a>
							</div>
						</div>
						<div class="portfolio-item">
							<a href="images/content/demo-only/portfolio/sample7.jpg" class="zoom img" title="Enter any text here" rel="portfolio">
								<img src="../../images/content/demo-only/portfolio/sample7-thumb.jpg" class="portfolio-image" alt="sample image" />
							</a>
							<div class="portfolio-description">
								<h4>Lorem Ipsum Dolor</h4>
								<p>Sed molestie, neque sed felis nisl mi sed odio. Aliquam mollis metus vel dolor amet nisi vehicula accumsan luctus a pretium.</p>
								<a href="#">More Information...</a>
							</div>
						</div>
						<div class="portfolio-item">
							<a href="images/content/demo-only/portfolio/sample1.jpg" class="zoom img" title="This is the image description" rel="portfolio">
								<img src="../../images/content/demo-only/portfolio/sample1-thumb.jpg" class="portfolio-image" alt="sample image" />
							</a>
							<div class="portfolio-description">
								<h4>Lorem Ipsum Dolor</h4>
								<p>Sed molestie, neque sed felis nisl mi sed odio. Aliquam mollis metus vel dolor amet nisi vehicula accumsan luctus a pretium.</p>
								<a href="#">More Information...</a>
							</div>
						</div>
						<div class="portfolio-item">
							<a href="images/content/demo-only/portfolio/sample5.jpg" class="zoom img" title="Enter any text here" rel="portfolio">
								<img src="../../images/content/demo-only/portfolio/sample5-thumb.jpg" class="portfolio-image" alt="sample image" />
							</a>
							<div class="portfolio-description">
								<h4>Lorem Ipsum Dolor</h4>
								<p>Sed molestie, neque sed felis nisl mi sed odio. Aliquam mollis metus vel dolor amet nisi vehicula accumsan luctus a pretium.</p>
								<a href="#">More Information...</a>
							</div>
						</div>
						<div class="portfolio-item">
							<a href="images/content/demo-only/portfolio/sample9.jpg" class="zoom img" title="This is the image description" rel="portfolio">
								<img src="../../images/content/demo-only/portfolio/sample9-thumb.jpg" class="portfolio-image" alt="sample image" />
							</a>
							<div class="portfolio-description">
								<h4>Lorem Ipsum Dolor</h4>
								<p>Sed molestie, neque sed felis nisl mi sed odio. Aliquam mollis metus vel dolor amet nisi vehicula accumsan luctus a pretium.</p>
								<a href="#">More Information...</a>
							</div>
						</div>
						<div class="portfolio-item">
							<a href="images/content/demo-only/portfolio/sample10.jpg" class="zoom img" title="Enter any text here" rel="portfolio">
								<img src="../../images/content/demo-only/portfolio/sample10-thumb.jpg" class="portfolio-image" alt="sample image" />
							</a>
							<div class="portfolio-description">
								<h4>Lorem Ipsum Dolor</h4>
								<p>Sed molestie, neque sed felis nisl mi sed odio. Aliquam mollis metus vel dolor amet nisi vehicula accumsan luctus a pretium.</p>
								<a href="#">More Information...</a>
							</div>
						</div>
						
					</div>
					
					<!-- End of Content -->
					<div class="clear"></div>
					
				</div>
				
				<!-- End of Content -->
				<div class="clear"></div>
			
			</div>
		
		</div>
		
		<!-- Footer -->
		<div id="Footer">
			<div id="FooterTop"></div>
			<div id="FooterContent">
			
				<div class="contentArea">
				
					<!-- Column 1 -->
					<div class="one-third">
						<h3>Design Details</h3>
						<p>Ceated by <a href="http://para.llel.us">Parallelus</a> and available for purchase on <a href="http://themeforest.net/user/Parallelus/portfolio">ThemeForest</a>.</p>
					</div>

					<!-- Column 2 -->
					<div class="one-third">
						<h3>Stay Connected</h3>
						<ul class="horizList">
							<li><a href="#"><img src="../../images/icons/social/delicious.png" width="40" height="40" alt="Delicious" /></a></li>
							<li><a href="#"><img src="../../images/icons/social/flickr.png" width="40" height="40" alt="Flickr" /></a></li>
							<li><a href="#"><img src="../../images/icons/social/linkedin.png" width="40" height="40" alt="LinkedIn" /></a></li>
							<li><a href="#"><img src="../../images/icons/social/skype.png" width="40" height="40" alt="Skype" /></a></li>
							<li><a href="#"><img src="../../images/icons/social/twitter.png" width="40" height="40" alt="Twitter" /></a></li>
							<li><a href="#"><img src="../../images/icons/social/yahoo.png" width="40" height="40" alt="Yahoo!" /></a></li>
						</ul>
						<p>Keep track of Unite on all your favorite social networks.</p>
					</div>

					<!-- Column 3 -->
					<div class="one-third last">
						<h3>Contact Information</h3>
						<div class="logoMark"></div>
						<p>
							(555) 443.3221<br />
							contact@unite-inc.com<br />
							<a href="#">www.unite-inc.com</a><br />
						</p>
					</div>
					
					<!-- End of Content -->
					<div class="clear"></div>
	
				</div>
					
			</div>
			<div id="FooterBottom"></div>
			
		</div>
		
		<!-- Copyright/legal text -->
		<div id="Copyright">
			<p>
				Copyright &copy; 2010 - <a href="http://para.llel.us" onclick="window.open(this.href); return false;">Parallelus</a> - All rights reserved. 
				Conforms to W3C Standard 
				<a href="http://validator.w3.org/check?uri=referer" onclick="window.open(this.href); return false;">XHTML</a> &amp; 
				<a href="http://jigsaw.w3.org/css-validator/check/referer?profile=css3" onclick="window.open(this.href); return false;">CSS</a>
			</p>
		</div>
		
	</div>
</div>

<!-- Activate Font Replacement (cufón) -->
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
